import { trigger, query, transition, style, stagger, animate } from "@angular/animations";

export const listAnim = trigger('listAnim', [
  transition('* => *', [
    query(':enter', [style({ 'position': 'fixed', width: '100%',height:'80%' })],{optional:true}),
    query(':leave', [style({ 'position': 'fixed', width: '100%', height: '80%' })], { optional: true }),
    query(':enter', [style({ transform: 'translateX(-100%)' }), stagger(500, [animate('.5s ease-in', style({ 'transform': 'translateX(0)' }))])],{ optional: true }),
    query(':leave', [style({ transform: 'translateX(0)' }), stagger(500, [animate('.5s ease-out', style({ 'transform': 'translateX(100%)' }))])], { optional: true }),
  ])
]);
